<template>
  <div class="msg-from-friends">
    <nav>
      <van-row>
        <van-col span="4" @click="backFunc">&lt;</van-col>
        <van-col span="14" offset="1">申请添加朋友</van-col>
      </van-row>
    </nav>
    <div v-for="m in applyNosic" :key="m.id" class="msg-list">
      <ApplyList :id="m.id" :text="m.text" />
    </div>
  </div>
</template>

<script>
import ApplyList from "@/components/ApplyList";
import { mapState,mapMutations } from "vuex";

export default {
  components: {
    ApplyList,
  },
  computed: {
    ...mapState({
      applyNosic: (state) => state.friends.friendsApplyArr,
    }),
  },
  methods: {
    ...mapMutations(['delMesg','cleanCount','cleanFriendsApplyArr']),
    backFunc() {
      this.$router.go(-1);
      this.delMesg();
      this.cleanCount();
      this.cleanFriendsApplyArr();
    },
  },
};
</script>

<style lang="scss" scoped>
.msg-from-friends {
  height: 100vh;
  overflow: hidden;
  background-color: rgb(17, 17, 17);
  color: white;

  nav {
    width: 100vw;
    height: 45px;
    background-color: rgb(17, 17, 17);
    line-height: 45px;
    color: white;
    text-align: center;
    font-size: 14px;
  }
}
</style>